<template>
  <n-flex>
    <n-space justify="space-between" class="w-full h-50px">
      <n-space>
        <n-button :loading="commonStore.loading" type="primary" tertiary @click="updateStockList">
          更新
        </n-button>
        <n-button type="warning" tertiary @click="filterStockList">
          刷新
        </n-button>
      </n-space>
      <n-input-group>
        <!--          <n-input-group-label>股票代码</n-input-group-label>-->
        <n-input placeholder="请输入股票代码/股票名称" v-model:value="filter" style="width: 180px" maxlength="6" clearable
        @keyup.enter="filterStockList"/>
        <n-button type="tertiary" tertiary @click="filterStockList">
          <template #icon>
            <n-icon>
              <SearchOutline/>
            </n-icon>
          </template>
        </n-button>
      </n-input-group>
    </n-space>
<!--    <pro-data-table-->
<!--        :loading="commonStore.loading"-->
<!--        title="远程数据"-->
<!--        :columns="columns"-->
<!--        row-key="no"-->
<!--        v-bind="tableProps"-->
<!--    />-->
    <n-data-table
        :loading="commonStore.loading"
        striped
        size="small"
        :columns="columns"
        :data="data"
        :bordered="true"
        :pagination="pagination"
    />
  </n-flex>
</template>

<script setup lang="ts">
import {h, onMounted, ref} from "vue";
import {useCommonStore} from "../store/common";
import {StockEntity} from "../../bindings/quant/backend/entity";
import {StockManager} from "../../bindings/quant/backend/manager";
import {NButton, NIcon, NSwitch} from "naive-ui";
import {SearchOutline} from "@vicons/ionicons5";
import {ProDataTable} from "pro-naive-ui";

const filter = ref("")
const commonStore = useCommonStore()
let entities: StockEntity[] = []

const pagination = {
  pageSize: 15
}

const columns = [
  //   {
  //   title: "ID",
  //   key: "id",
  // },
  {
    title: "股票代码",
    key: "code"
  },
  {
    title: "股票名称",
    key: "name"
  },
  {
    title: "流通股本",
    key: "float_volume"
  },
  {
    title: "总股本",
    key: "total_volume"
  },
  {
    title: '启用',
    key: 'enabled',
    width: 80,
    sorter: 'default',
    render(row: StockEntity) {
      return h(
          NSwitch,
          {
            value: row.enabled, size: 'small', onUpdateValue: () => {
              switchStatus(row.id)
              row.enabled = !row.enabled
              if (row.enabled) {
                window.$message?.success('已启用股票 [' + row.name + ']')
              } else {
                window.$message?.info('已禁用股票 [' + row.name + ']')
              }
            }
          }
      )
    },
  },
];
let data = ref<StockEntity[]>()

const switchStatus = (id: number) => {
  StockManager.SwitchStatus(id).then(() => {
    // getStockList()
  }).catch((err) => {
    window.$message?.error("切换状态出错：" + err);
  }).finally(() => {
    commonStore.loading = false
  })
}

const updateStockList = () => {
  commonStore.loading = true
  StockManager.UpdateStockList().then((result) => {
    window.$message?.success("新增数量：" + result[0] + ", 修改数量：" + result[1]);
    getStockList()
  }).catch((err) => {
    window.$message?.error("更新股票列表出错：" + err);
  }).finally(() => {
    commonStore.loading = false
  })
}
const filterStockList =()=>{
  commonStore.loading = true
  data.value = entities.filter(entity=>entity.code.includes(filter.value)||entity.name.includes(filter.value));
  // getStockList()
  commonStore.loading = false
}
const getStockList = () => {
  commonStore.loading = true
  StockManager.FindAll().then((result: StockEntity[]) => {
    entities = result
    data.value = entities
  }).catch((err: Error) => {
    window.$message?.error("获取数据出错：" + err);
  }).finally(() => {
    commonStore.loading = false
  })
}

onMounted(() => {
  getStockList()
})
</script>


<style scoped>

</style>